<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<title>购物车</title>
		<link rel="stylesheet" href="asset/css/conmom.css" /> 
		<link rel="stylesheet" href="asset/css/shopCat.css" />
	</head>
	<body>
		<div class="cart">
		   <div class="title"><i class="iconfont back icon-xiangzuo2" onclick="window.history.go(-1)"></i>购物车</div>
		    <div class="allShop">
		    	<div class="oneShop">
		    		<div class="shopName ">
			    		<span class="shopI"><span class="radius "><i class="icon iconfont icon-gougou"></i></span></span>
			    		<a href="">
			    			<i class="icon iconfont icon-shouye"></i>
			    			奇高灯饰
			    		</a>
			    		<i class="icon iconfont icon-xiangyou show"></i>
			    	</div>
		    		<div class="commodity" data-id="76415" data-product-id="6721">
		    			<span class="oneI"><span class="radius "><i class="icon iconfont icon-gougou"></i></span></span>
		    			<img src="http://findeng.com:8080/findeng/picture/product/thumbnailImage/15056181400620.jpg">
		    			<div class="cartLeft">
		    				<p><a href="">欧式奢华81725-8吊灯</a></p>
		    				<div class="numDiv">
		    					<span class="change-num reduce">-</span>
									<input class="num" type="tel" value="1" maxdata="100" data-price="1342.0" data-originprice="1342.0">
								<span class="change-num increase">+</span>
		    				</div>
		    			</div>
		    			<div class="cartRight">
		    				<i class="iconfont delIcon"></i>
		    				<h4>￥1342.00</h4>
		    			</div>
		    		</div>
		    		
		    		<div class="commodity" data-id="76416" data-product-id="6726">
		    			<span class="oneI"><span class="radius "><i class="icon iconfont icon-gougou"></i></span></span>
		    			<img src="http://findeng.com:8080/findeng/picture/product/thumbnailImage/15056185964870.jpg">
		    			<div class="cartLeft">
		    				<p><a href="">欧式奢华81725-6+15+10+6吊灯</a></p>
		    				<div class="numDiv">
		    					<span class="change-num reduce">-</span>
									<input class="num" type="tel" value="11" maxdata="100" data-price="9120.0" data-originprice="9120.0">
								<span class="change-num increase">+</span>
		    				</div>
		    			</div>
		    			<div class="cartRight">
		    				<i class="icon iconfont icon-del delIcon"></i>
		    				<h4>￥100320.00</h4>
		    			</div>
		    		</div>
		    	</div>
		    </div>
		    <div class="cartBottom">
		    	<div class="payDiv">
		    		<span>共:<span class="allMoney">￥101662.00</span></span>
		    		<button class="payButtom" onclick="window.location.href='settlement.html'">去结算(<span class="allNum">12</span>)</button>
		    	</div>
		    	<div class="chooseAll">
		    		<span class="radius"><i class="iconfont"></i></span>
		    		<span>全选</span>
		    	</div>
		    </div>
		    <!--弹窗-->
			<div class="logn-popup">
				<div class="logn-popup-div"></div>
				<div class="logn-popup-detalis">
					<div class="logn-popup-title">
						<!--<i class="icon iconfont icon-guanbi"></i>-->
						提示
					</div>
					<div class="logn-popup-box">
						<i class="icon iconfont icon-guanbi"></i>确定删除此商品
					</div>
					<div class="logn-popup-btn">
						<div class="logn-btn1">取消</div>
						<div class="logn-btn2">确定</div>
					</div>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript" src="public/jquery.min.js" ></script>
	<script type="text/javascript" src="asset/font/iconfont.js" ></script>
	<script>
		/*全选、反选*/
      $(".shopI").on('click', function () {
	      	var dot=$(this).parent();
			if(dot.hasClass("active")){
				$(".chooseAll").removeClass("active");	
				dot.removeClass("active");
				dot.parent().find(".commodity").removeClass("active");
			}else{
				dot.addClass("active");
				dot.parent().find(".commodity").addClass("active");
				var flag=true;
				$(".shopName").each(function(){
					if(!$(this).hasClass("active")){
						flag=false;
						return false;
					}
				});
				if(flag){
					$(".chooseAll").addClass("active");
				}
			}
	    });
	    $(".oneI").on('click',function(){
	    	var dot=$(this).parent();
	    	if(dot.hasClass("active")){
				dot.removeClass("active");
				dot.parent().find(".shopName").removeClass("active");
				$(".chooseAll").removeClass("active");
			}else{
				dot.addClass("active");
				var flag=true;
					dot.parent().find(".commodity").each(function(){
					if(!$(this).hasClass("active")){
						flag=false;
						return false;
					}
				});
			if(flag){
					dot.parent().find(".shopName").addClass("active");
					$(".shopName").each(function(){
						if(!$(this).hasClass("active")){
							flag=false;
							return false;
						}if(flag){
							$(".chooseAll").addClass("active");
						}
								
					});
				}
			}
	    });
	    $(".chooseAll").click(function(){
		if($(this).hasClass("active")){
			$(this).removeClass("active");
			$(".shopName").removeClass("active");
			$(".commodity").removeClass("active");
		}else{
			$(this).addClass("active");
			$(".shopName").addClass("active");
			$(".commodity").addClass("active");
		}
	});
	/*删除*/
	$(".logn-btn1").on('click',function(){
		$(".logn-popup").hide();
	});
	$(".delIcon").on('click',function(){
		$(".logn-popup").show();
		var th=$(this);
		$(".logn-btn2").on('click',function(){
			$(".logn-popup").hide();
			if(th.parents(".oneShop").find(".commodity").length ==1){
				th.parents(".oneShop").children().remove();
			}else{th.parent().parent().remove();}
		})
	});
	/*隐藏*/
	$(".shopName .show").click(function(){
		if($(this).hasClass("rotate")){
			$(this).removeClass("rotate");
			$(this).parent().parent().find(".commodity").css("display","block");
		}else{
			$(this).addClass("rotate");
			$(this).parent().parent().find(".commodity").css("display","none");
		}
	});
	
	</script>
</html>
